<template> 
	<div class="enterprisePage">
		<!-- 企业画像左侧 -->
		<div class="pageLeft"> 
		
			<pageHeader></pageHeader>
			<pageContent></pageContent>
		</div>
		<!-- 企业画像右侧-->
		<div class="pageRight">
			<!-- 企业画像右侧企业数 排序功能-->
			<div class="pageRight_top">
				<div class="topTotal">找到<span> {{allNum}} </span>家企业</div>
				<div class="moneyData">
					<div class="moneyData_item">
						<div class="zibentext">注册资本</div>
						<div class="zibenlist">
							<div class="zibenlist_li">
								<img v-if="zbNum=='asc'" src="../../../public/images/enterprise/zitop-on@2x.png" >
								<img v-else @click="changeSort('capital','asc')" src="../../../public/images/enterprise/zitop@2x.png" >
							</div>
							<div class="zibenlist_li">
								<img v-if="zbNum=='desc'" src="../../../public/images/enterprise/zibottom-on@2x.png" >
								<img v-else @click="changeSort('capital','desc')" src="../../../public/images/enterprise/zibottom@2x.png" >
							</div>
						</div>
					</div>
					<div class="moneyData_item">
						<div class="zibentext">成立日期</div>
						<div class="zibenlist">
							<div class="zibenlist_li" >
								<img v-if="rqNum=='asc'" src="../../../public/images/enterprise/zitop-on@2x.png" >
								<img v-else @click="changeSort('data','asc')" src="../../../public/images/enterprise/zitop@2x.png" >
							</div>
							<div class="zibenlist_li" >
								<img v-if="rqNum=='desc'" src="../../../public/images/enterprise/zibottom-on@2x.png" >
								<img v-else @click="changeSort('data','desc')" src="../../../public/images/enterprise/zibottom@2x.png" >
							</div>
						</div>
					</div>
				</div>
			</div>
			<!-- 企业画像右侧每个企业排列-->
			<div class="pageRight_bottom" 
			ref="pbottom" 
			v-loading="loading"
			element-loading-text="拼命加载中"
			element-loading-spinner="el-icon-loading"
			element-loading-background="rgba(0, 0, 0, 0.5)">
			<div class="pageRight_item" v-for="(item,index) in qiyeList" :key="index">
				<div class="pageItem_top">
					<div class="pageTop_left" @click="toenter(item.company_name)">
						<img :src="item.iconurl" alt="" v-if="item.iconurl">
						<p v-else>{{item.company_name.slice(0,4)}}</p>
					</div>
					<div class="pageTop_right" @click="toenter(item.company_name)">
						<div class="pageTop_left_title">
							{{item.company_name}} 
							
							<div  v-if="item.field" style="display: flex;">
								<div class="pageTop_left_titlesub" v-for="item1 in item.field.split(',')" v-if="item1!=''">
									{{item1}}
								</div>
							</div>
						</div>
						<div class="pageTop_left_prize">
							<div v-if="item.qualified_name" style="display: flex;">
								<div class="prize_item" v-for="item1 in item.qualified_name.split(',')" v-if="item1!=''">
									{{item1}}
								</div>
							</div>
						</div>
					</div>
				</div>
				<div class="pageItem_center">
					<div class="center_money">注册资本：{{item.regcapital_amt}}万元</div>
					<div class="center_people">法人：{{item.legal_rep}}</div>
					<div class="center_date">成立日期：{{item.found_date}}</div>
				</div>
				<div class="pageItem_bottom">注册地址：{{item.reg_address}}</div>
			</div>
			</div>
		</div>
	</div>
</template>

<script> 
	import pageHeader from '../../components/enterprise/pageHeader.vue'
	import pageContent from '../../components/enterprise/pageContent.vue'
	export default{
		name:"enterprisePage",
		data() {
			return {
				qiyeList:[],
				zbNum:'desc',
				rqNum:'',
				allNum:0,
				tname:'新材料',
				loading:true
			}
		},
		mounted() {
			this.getNewdata()
			this.getSearchData()
			this.getTname()
			window.addEventListener("scroll", this.handleScroll, true);
		},
		filters:{
			dateParse(dataString){
				/* 过滤器 */
			    if (dataString) {
			        let date = new Date(dataString);
			        let Y = date.getFullYear() + '-';
			        let M = (date.getMonth() + 1 < 10 ? '0' + (date.getMonth() + 1) : date.getMonth() + 1) + '-';
			        let D = (date.getDate() < 10 ? '0' + date.getDate() : date.getDate()) + ' ';
			        return Y + M + D ;
			    } else {
			        return '';
			    }
			}
		},
		methods:{ 
			// 跳转到指定公司详情页
			toenter(comname){
				this.$router.push({
					path:'/enterpriseOne',
					query:{
						comname:comname
					}
				})
				this.$bus.$emit('updateComname',comname)
			},
			handleScroll(e){
				// console.log(e.target)
			},
			// 获取当前材料名
			getTname(){
				this.$bus.$on('upTname',item=>{
					this.tname=item
					this.$nextTick(()=>{
						this.getNewdata()
					})
				})	
			},
			// 获取搜索后的数据
			getSearchData(){
				this.$bus.$on('loadingData',item=>{
					this.loading=item
				})
				this.$bus.$on('updateListData',(dataobj,datanum)=>{
					this.qiyeList=dataobj
					this.allNum=datanum
					this.loading=false
				})
			},
			// 页面最初数据
			async getNewdata(){
				var dt = {
					"mappingName":this.tname,
					"xjlabels":"全部",
					"gjlabels":"全部",
					"qylabels":"全部",
					"regcapitalAmtSort":this.zbNum,
					"foundDateSort":this.rqNum
				};
				const aaa = await this.$api.post('dcockpit/rest/nbCockpitApi/searchEnterprisePortraitListV2', dt)
				let {custom:{result}}={...aaa}
				this.allNum=result.count
				this.qiyeList=result.list
				this.loading=false
			},
			// 将根据注册资本或成立日期升降序
			changeSort(type,csort){
				switch(type){
					case 'capital':
						this.zbNum=csort
						this.rqNum=''
						this.$bus.$emit('updateSort',this.zbNum,this.rqNum)
						break;
					case 'data':
						this.zbNum=''
						this.rqNum=csort
						this.$bus.$emit('updateSort',this.zbNum,this.rqNum)
						break;
				}
			},
			
		}, 
		 components:{
			 pageHeader,
			 pageContent
		 }
	}
</script>

<style lang="stylus" rel='stylesheet/stylus' scoped>
	@import "~@/assets/enterprisePage.styl"
</style>
